<template>
	<view :style="{height: showSkeleton ? '90vh' : 'auto'}">
		
		<skeleton :show="showSkeleton" :isNodes="isNodes" ref="skeleton" loading="chiaroscuro" selector="skeleton"
			bgcolor="#FFF"></skeleton>
		<view v-if="!errorNetwork" :style="{visibility: showSkeleton ? 'hidden' : 'visible'}">
			<view class="page-index skeleton" :class="{ bgf: navIndex > 0 }">
				<!-- 首頁头部搜索部分 -->
				<!-- #ifdef H5 || APP-PLUS  -->
				<view class="header">
					<view class="serch-wrapper flex acea-row row-between-wrapper" style="justify-content: flex-end;">
						<!-- <view class="logo skeleton-rect">
							<image :src="logoUrl" mode=""></image>
						</view>
						<navigator url="/pages/columnGoods/goods_search/index" :class="logoUrl ? 'input' : 'uninput'"
							hover-class="none">
							<text class="iconfont icon-xiazai5"></text>
							{{$t('search.title3')}}
						</navigator> -->
						<!-- 						<navigator class="btn" url="/pages/chat/customer_list/index?type=0" hover-class="none">
							<view class="iconfont icon-xiaoxi"></view>
							<text class="iconnum bg-color-red" v-if="userInfo.total_unread">{{ userInfo.total_unread }}</text>
						</navigator> -->

						<picker @change="bindBzChange" :value="bzIndex" :range-key="'DEPARTNAME'" :range="bzArray">
							<view :class="'uni-input language language'+bzIndex">
								<!-- {{bzArray[bzIndex].DEPARTNAME || ''}} -->
							</view>
						</picker>
					</view>

					<!-- <tabNav class="tabNav" :class="{ fixed: isFixed }" :tabTitle="navTop" @changeTab="changeTab" :style="{display: showSkeleton ? 'none' : 'block'}"></tabNav> -->
				</view>
				<!-- #endif -->

				<!-- #ifdef MP-->
				<view class="mp-header">
					<view class="sys-head skeleton-rect" view :style="{ height: statusBarHeight }"></view>
					<view class="serch-box skeleton-rect" view style="height: 43px;">
						<view class="serch-wrapper flex">
							<view class="logo skeleton-rect">
								<image :src="logoUrl" mode=""></image>
							</view>
							<navigator url="/pages/columnGoods/goods_search/index"
								:class="logoUrl ? 'input' : 'uninput'" hover-class="none" class="skeleton-rect">
								<text class="iconfont icon-xiazai5"></text>
								{{$t('search.title3')}}
							</navigator>

							<picker @change="bindBzChange" :value="bzIndex" :range-key="'DEPARTNAME'" :range="bzArray">
								<view :class="'uni-input language language'+bzIndex">
									<!-- {{bzArray[bzIndex].DEPARTNAME || ''}} -->
								</view>
							</picker>
						</view>
					</view>
					<!-- <tabNav class="tabNav" :tabTitle="navTop" @changeTab="changeTab" :style="{display: showSkeleton ? 'none' : 'block'}"></tabNav> -->
				</view>
				<!-- #endif -->

				<!-- 首頁头部搜索部分结束 -->

				<!-- 首頁展示 -->
				<view class="page_content skeleton" v-if="navIndex == 0" :style="{ paddingTop: 0 + 'px' }">


					<view class="page_bg">
						<!-- #ifdef MP -->
						<!-- <view class="mp-bg"></view> -->
						<!-- #endif -->
						<!-- banner 开始 -->
						<view class="swiper page_swiper" v-if="imgUrls.length">
							<swiper indicator-dots="true" :autoplay="true" :circular="circular" :interval="interval"
								:duration="duration" indicator-color="#E4E4E4" indicator-active-color="#E93323"
								previous-margin="0rpx" next-margin="0rpx" :current="swiperCur" @change="swiperChange">
								<block v-for="(item, index) in imgUrls" :key="index">
									<swiper-item :class="{ active: index == swiperCur }">
										<view @click="goUrl(item.url)"
											class="slide-navigator acea-row row-between-wrapper">
											<image :src="item.pic" class="slide-image skeleton-rect"></image>
										</view>
									</swiper-item>
								</block>
							</swiper>
						</view>
						<!-- banner 结束 -->
						<!-- menu 商品品類列表开始-->
						<view class="nav acea-row">
							<block v-for="(item, index) in menus" :key="index">
								<view class="item" @click="goMenuDetail(item)">
									<view class="pictrue">
										<image :src="item.pic" class="skeleton-radius"></image>
									</view>
									<view class="menu-txt area-row skeleton-rect">{{ item.name }}</view>
								</view>
							</block>
						</view>
						<!-- menu 商品品類列表结束-->
						<!-- 后端配置跳转用宣传图片 -->
						<view class="adlist">
							<view class="ad" v-if="ad.home_ad_pic">
								<navigator class="ad skeleton-rect" :url="ad.home_ad_url" hover-class="none">

									<image mode="widthFix" :src="ad.home_ad_pic"></image>
								</navigator>
							</view>
							<view class="ad" v-if="ad.home_ad_pic2">
								<navigator class="ad skeleton-rect" :url="ad.home_ad_url2" hover-class="none">

									<image mode="widthFix" :src="ad.home_ad_pic2"></image>
								</navigator>
							</view>
							<view class="ad" v-if="ad.home_ad_pic3">
								<navigator class="ad skeleton-rect" :url="ad.home_ad_url3" hover-class="none">

									<image mode="widthFix" :src="ad.home_ad_pic3"></image>
								</navigator>
							</view>
							<view class="ad" v-if="ad.home_ad_pic4">
								<navigator class="ad skeleton-rect" :url="ad.home_ad_url4" hover-class="none">

									<image mode="widthFix" :src="ad.home_ad_pic4"></image>
								</navigator>
							</view>
							<view class="ad" v-if="ad.home_ad_pic5">
								<navigator class="ad skeleton-rect" :url="ad.home_ad_url5" hover-class="none">

									<image mode="widthFix" :src="ad.home_ad_pic5"></image>
								</navigator>
							</view>
						</view>

						<!-- 后端配置跳转用宣傳圖片结束 -->
						<!--秒杀 开始-->
						<view class="main">
							<view v-if="spikeList.length > 0" class="skeleton-rect skeleton-rect">
								<view class="seckill-count">
									<view class="spike-bd">
										<view class="acea-row row-middle">
											<!-- <image class="title-img" src="/static/images/spike_title.png"></image> -->
											<view class="spike-distance">
												<text class="text bg-red">{{$t('index.end')}}</text>
												<countDown :is-day="false" :tip-text="' '" :day-text="' '"
													:hour-text="':'" :minute-text="':'" :second-text="' '"
													:datatime="datatime"></countDown>
											</view>
										</view>

										<navigator url="/pages/activity/goods_seckill/index" class="more-btn"
											hover-class="none">
											{{$t('index.more.surprise')}}
											<text class="iconfont icon-jiantou" hover-class="none"></text>
										</navigator>
									</view>
									<view class="spike-wrapper">
										<scroll-view scroll-x="true" style="white-space: nowrap; display: flex"
											show-scrollbar="false">
											<navigator class="spike-item" v-for="(item, index) in spikeList"
												:key="index"
												:url="'/pages/activity/goods_seckill_details/index?id=' + item.product_id + '&time=' + item.stop + ''"
												hover-class="none">
												<view class="img-box">
													<image :src="item.image" mode=""></image>
												</view>
												<view class="info">
													<view class="name line1">{{ item.store_name }}</view>
													<view class="stock-box">
														<view class="grabbed" :style="'width:' + item.percent + ';'">
														</view>
														<text class="stock-sales">{{ item.percent }}</text>
													</view>
													<view class="price-box">
														<text class="price">
															<text>{{$t('index.symbol')}}</text>
															{{ item.price }}
														</text>
														<text class="old-price">
															<text>{{$t('index.symbol')}}</text>
															{{ item.ot_price }}
														</text>
													</view>
												</view>
											</navigator>
										</scroll-view>
									</view>
								</view>
							</view>

						</view>
						<!--秒杀 结束-->

						<!-- 拼团 开始-->

						<!-- 拼团 结束-->
					</view>

					<!--活动专题-->
					<!-- <view class="main">

						<view class="skeleton-rect">

							<view v-if="activityData.length > 0" class="activity_count">
								<view class="spike-bd">
									<view class="title line1">
										<image class="title-img" src="/static/images/topic_title.png"></image>
									</view>
									<navigator url="/pages/activity/topic/index" class="more-btn" hover-class="none">
										{{$t('index.special.subject')}}
										<text class="iconfont icon-jiantou" hover-class="none"></text>
									</navigator>
								</view>

								<view class="topic_swiper" v-if="activityData.length">
									<swiper indicator-dots="true" :autoplay="autoplay" :circular="circular" :interval="interval" :duration="duration"
									 indicator-color="rgba(255,255,255,0.6)" indicator-active-color="#fff">
										<block v-for="(item,index) in activityData" :key="index">
											<swiper-item>
												<navigator :url="'/pages/activity/topic_detail/index?id='+item.group_data_id" class='slide-navigator acea-row row-between-wrapper' hover-class='none'>
													<image :src="item.pic" class="slide-image"></image>

												</navigator>
											</swiper-item>
										</block>
									</swiper>
								</view>
							</view>
						</view>

					</view> -->
					<!-- #ifdef MP -->
					<!--直播 开始 -->
					<view class="main" v-if="liveList.length > 0">
						<view class="live-count">
							<view>
								<!-- 直播 -->
								<block>
									<view class="spike-bd" style="padding-left: 10rpx;">
										<view class="title line1">
											<image class="title-img" src="/static/images/broadcast_title.png"></image>
										</view>
										<navigator url="/pages/activity/liveBroadcast/index" class="more-btn"
											hover-class="none">
											{{$t('index.channel')}}
											<text class="iconfont icon-jiantou" hover-class="none"></text>
										</navigator>
									</view>

									<view class="live-wrapper mores">
										<scroll-view scroll-x="true" style="white-space: nowrap; display: flex">
											<view class="item" v-for="(item, index) in liveList" :key="index">
												<navigator hover-class="none" :url="item.link">
													<view class="live-top"
														:style="'background:' + (item.live_status == 101 ? playBg : item.live_status != 101 && item.live_status != 102 ? endBg : notBg) + ';'"
														:class="item.live_status == 102 ? 'playRadius' : 'notPlayRadius'">
														<block v-if="item.live_status == 101">
															<image src="/static/images/live-01.png" mode=""></image>
															<text>{{$t('index.live')}}</text>
														</block>
														<block
															v-if="item.live_status == 103 && item.replay_status === 1">
															<image src="/static/images/live-02.png" mode=""></image>
															<text>{{$t('index.playback')}}</text>
														</block>
														<block
															v-if="(item.live_status != 101 && item.live_status != 102 && item.live_status != 103) || (item.live_status == 103 && item.replay_status == 0)">
															<image src="/static/images/live-02.png" mode=""></image>
															<text>{{$t('index.Finished')}}</text>
														</block>
														<block v-if="item.live_status == 102">
															<image src="/static/images/live-03.png" mode=""></image>
															<text>{{$t('index.Trailer')}}</text>
														</block>
													</view>
													<view v-if="item.live_status == 101 || item.live_status == 102"
														class="broadcast-time">{{ item.show_time }}</view>
													<easy-loadimage mode="widthFix"
														:image-src="item.share_img"></easy-loadimage>
													<!-- <view class="live-title">{{ item.live_status }}</view> -->
												</navigator>
											</view>
										</scroll-view>
									</view>
								</block>

							</view>
						</view>

					</view>
					<!-- 直播模块 结束 -->
					<!-- #endif -->

					<!--預售 开始-->
					<!-- <presell :presellList="presellList" class="skeleton-rect"></presell> -->
					<!--預售 结束 -->

					<!--助力-->
					<!-- <view class="main" v-if="assistList.length > 0">
						<view class="skeleton-rect">
							<view class="assist-count">
								<view class="spike-bd">
									<view class="title line1"><image class="title-img" src="/static/images/assist_title.png"></image></view>
									<view v-if="assistUserList.length > 0" class="activity_pic">
										<view v-for="(item, index) in assistUserList" class="picture">
											<text v-if="item.avatar_img" class="avatar" :style="'background-image: url(' + item.avatar_img + ')'"></text>
											<text v-else class="avatar" style="background-image: url('/static/images/f.png')"></text>
										</view>
										<text class="pic_count">{{ assistUserCount }}{{$t('index.People.help')}}</text>
									</view>
									<navigator url="/pages/activity/assist/index" class="more-btn" hover-class="none">
										{{$t('index.more.activity')}}
										<text class="iconfont icon-jiantou" hover-class="none"></text>
									</navigator>
								</view>
								<view class="wapper_count">
									<view class="spike-wrapper">
										<scroll-view scroll-x="true" style="white-space: nowrap; display: flex" show-scrollbar="false">
											<view class="spike-item assist-item" v-for="(item, index) in assistList" :key="index" @click="handleAssist(item.product_assist_id)">
												<view class="img-box">
													<easy-loadimage mode="widthFix" :image-src="item.product.image"></easy-loadimage>
													<text class="participants">{{ item.user_count }}{{$t('index.participate.in')}}</text>
												</view>
												<view class="assist-info">
													<view class="price-box presell-price">
														<view class="name line1">{{ item.store_name }}</view>
														<text class="price">
															<text class="assist_price">{{$t('index.Help.price')}}</text>
															<text>{{$t('index.symbol')}}</text>
															{{ item.assistSku[0].assist_price }}
														</text>
													</view>
													<button class="initiate_btn">{{$t('index.Initiate.assistance')}}</button>
												</view>
											</view>
										</scroll-view>
									</view>
								</view>
							</view>
						</view>

					</view> -->
					<!--助力结束-->
					<!--种草 开始 -->
					<!-- <view class="main">
						<view class="plant-count skeleton-rect">
							<block v-if="community_status == 1">
								<view class="spike-bd plant_bg">
									<view class="title line1"><image class="title-img" src="/static/images/plant_title.png"></image></view>
									<navigator :open-type="open_grass ? 'switchTab' : 'navigate'" url="/pages/plant_grass/index" class="more-btn" hover-class="none">
										{{$t('index.Good.sharing')}}
										<text class="iconfont icon-jiantou" hover-class="none"></text>
									</navigator>
								</view>
								<view class="live-wrapper plant" style="border-radius: 0;">
									<scroll-view scroll-x="true" style="white-space: nowrap; display: flex">
										<navigator hover-class="none" :url="'/pages/plantGrass/plant_detail/index?id='+item.community_id" v-for="(item, index) in plantList" :key="index" class="item">
											<view>
												<easy-loadimage mode="widthFix" :image-src="item.image[0]"></easy-loadimage>
												<view class="item_text">
													<text class="text_name line1">{{item.title}}</text>
													<view v-if="item.author" class="text_count acea-row">
														<image :src="item.author.avatar || '/static/images/f.png'"></image>
														<text class="name line1">{{item.author.nickname}}</text>
													</view>
												</view>
											</view>
										</navigator>
									</scroll-view>
								</view>
							</block>
						</view>
					</view> -->
					<!-- 种草结束 -->
					<view class="main">
						<view class="skeleton-rect">
							<!-- 热点菜單 -->
							<hot-menu :hot="hot"></hot-menu>
							<!-- 热点菜單结束 -->
							<!-- 品牌好店 -->
							<brand-store v-if="brandList.length && hide_mer_status != 1" :brandList="brandList"
								:hide_mer_status="hide_mer_status"></brand-store>
							<!-- 品牌好店结束 -->
							<!-- 首頁推薦 -->
							<view class="index-product-wrapper">
								<!-- 首发新品 -->
								<recommend :hostProduct="hostProduct" :indexP="true" :isLogin="isLogin"></recommend>
								<view class="loadingicon acea-row row-center-wrapper" v-if="hostProduct.length > 0">
									<text class="loading iconfont icon-jiazai" :hidden="hotLoading == false"></text>
									{{ hotTitle }}
								</view>
							</view>
						</view>

					</view>
				</view>
				<!-- 分類頁 -->
				<view class="productList" v-if="navIndex > 0" :style="'margin-top:' + prodeuctTop + 'px;'">
					<view class="sort acea-row" :class="sortList.length ? '' : 'no_pad'"
						:style="{ marginTop: sortMarTop + 'px' }">
						<navigator hover-class="none" v-if="index < 9"
							:url="'/pages/columnGoods/goods_list/index?id=' + item.store_category_id + '&title=' + item.cate_name"
							class="item" v-for="(item, index) in sortList" :key="index">
							<view class="pictrue">
								<image :src="item.pic"></image>
							</view>
							<view class="text">{{ item.cate_name }}</view>
						</navigator>
						<view class="item" @click="bindMore(item)" v-if="sortList.length >= 9">
							<view class="pictrues acea-row row-center-wrapper"><text
									class="iconfont icon-gengduo1"></text></view>
							<view class="text" style="margin-top: 22rpx;">{{$t('index.more')}}</view>
						</view>
					</view>
					<block v-if="sortProduct.length > 0">
						<view class="list acea-row row-between-wrapper">
							<navigator @tap="goDetails(item)" class="item" v-for="(item, index) in sortProduct"
								:key="index">
								<view class="pictrue">
									<easy-loadimage :image-src="item.image"></easy-loadimage>
								</view>
								<view class="text">
									<view class="name line1">

										<text class="name_text line1">{{ item.store_name }}</text>
									</view>
									<view class="acea-row row-middle">
										<view class="money font-color-red">
											{{$t('index.symbol')}}
											<text class="num">{{ item.price }}</text>
										</view>
										<!-- <text class="coupon font-color-red" v-if="item.issetCoupon">领券</text> -->
									</view>
									<view class="item_tags acea-row" v-if="item.merchant">
										<text v-if="item.merchant.type_name && item.product_type == 0"
											class="font-bg-red">{{ item.merchant.type_name }}</text>
										<text v-else-if="item.merchant.is_trader && item.product_type == 0"
											class="font-bg-red">{{$t('index.Self.operated')}}</text>
										<text v-if="item.product_type != 0"
											:class="'font_bg-red type' + item.product_type">
											{{ item.product_type == 1 ? $t('index.seckill') : item.product_type == 2 ? $t('index.Presale') : item.product_type == 3 ? '助力' : item.product_type == 4 ? '拼团' : '' }}
										</text>
										<text class="tags_item ticket"
											v-if="item.issetCoupon">{{$t('index.Collect.coupons')}}</text>
										<text class="tags_item delivery"
											v-if="item.delivery_free == 1">{{$t('index.free.shipping')}}</text>
									</view>
								</view>
							</navigator>
							<view class="loadingicon acea-row row-center-wrapper"
								v-if="sortProduct.length > 0 || sortProductLoading">
								<text class="loading iconfont icon-jiazai" :hidden="loading == false"></text>
								{{ loadTitle }}
							</view>
						</view>
					</block>
					<block v-if="sortProduct.length == 0">
						<view class="noCommodity">
							<view class="pictrue" style="margin: 0 auto;">
								<image src="/static/images/noShopper.png"></image>
							</view>
							<recommend :hostProduct="hostProduct"></recommend>
						</view>
					</block>

				</view>
				<!-- #ifdef H5 -->
				<a v-if="copyRightData" href="https://beian.miit.gov.cn/#/Integrated/index"
					class="copyRight">{{copyRightData}}</a>
				<!-- #endif -->
			</view>
		</view>
		<view v-else>
			<view class="error-network">
				<image src="/static/images/error-network.png"></image>
				<view class="title">{{$t('index.Network.disconnected')}}</view>
				<view class="con">
					<view class="label">{{$t('index.check.situation')}}：</view>
					<view class="item">· {{$t('index.network.settings')}}</view>
					<view class="item">· {{$t('index.weak.network')}}</view>
					<view class="item">· {{$t('index.upgrading')}}</view>
				</view>
				<view class="btn" @click="reconnect">{{$t('index.Reconnect')}}</view>
			</view>
		</view>
		<!-- #ifdef APP-PLUS -->
		<view class="privacy-wrapper" v-if="privacyStatus">
			<view class="privacy-box">
				<view class="title">{{$t('index.agreement')}}</view>
				<view class="content">{{$t('index.agreement.content')}}
					<br />
					{{$t('index.can.close')}}
					<navigator url="/pages/users/privacy/index">{{$t('index.privacy')}}</navigator>
					{{$t('index.privacy.content')}}
				</view>
				<view class="btn-box">
					<view class="btn-item" @click="confirmApp">{{$t('index.agreen')}}</view>
					<view class="btn" @click="closeModel">{{$t('index.Look.around')}}</view>
				</view>
			</view>
		</view>
		<!-- #endif -->
		<!-- 发送给朋友圖片 -->
		<view class="share-box" v-if="isIntegral">
			<image src="/static/images/share-info.png" @click="closeShare"></image>
		</view>
		<!-- #ifdef MP -->
		<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"
			:isGoIndex="false"></authorize>
		<!-- #endif -->
		<!-- #ifndef H5 -->
		<passwordPopup></passwordPopup>
		<!-- #endif -->
	</view>
</template>
<script>
	// +----------------------------------------------------------------------
	// | CRMEB [ CRMEB赋能开发者，助力企業发展 ]
	// +----------------------------------------------------------------------
	// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
	// +----------------------------------------------------------------------
	// | Licensed CRMEB並不是自由软件，未经许可不能去掉CRMEB相關版权
	// +----------------------------------------------------------------------
	// | Author: CRMEB Team <admin@crmeb.com>
	// +----------------------------------------------------------------------
	import appUpdate from '@/uni_modules/leruge-app-update/js_sdk/leruge-app-update.js'

	var statusBarHeight = uni.getSystemInfoSync().statusBarHeight + 'px';
	let app = getApp();
	import {
		getUserInfo
	} from '@/api/user.js';
	import {
		getIndexData,
		getCoupons,
		getAppVersion
	} from '@/api/api.js';
	// #ifdef MP-WEIXIN
	import {
		getTemlIds
	} from '@/api/api.js';
	import {
		SUBSCRIBE_MESSAGE,
		TIPS_KEY
	} from '@/config/cache';
	import {
		getLiveList
	} from '@/api/store.js';
	// #endif
	import {
		graphicLstApi
	} from '@/api/community.js';
	import {
		getShare,
		follow,
		getconfig
	} from '@/api/public.js';
	import {
		getSeckillIndexTime
	} from '@/api/activity.js';
	import goodList from '@/components/goodList';
	import promotionGood from '@/components/promotionGood';
	import couponWindow from '@/components/couponWindow';
	import {
		goShopDetail
	} from '@/libs/order.js';
	import {
		mapGetters
	} from 'vuex';
	import tabNav from '@/components/tabNav.vue';
	import countDown from '@/components/countDown';
	import {
		getCategoryList,
		getProductslist,
		getProductHot,
		storeCategory,
		storeMerchantList
	} from '@/api/store.js';
	import {
		getPresellList,
		getSeckillList,
		getAssistList,
		initiateAssistApi,
		assistUserData,
		getCombinationList
	} from '@/api/activity.js';
	import {
		openBargainSubscribe
	} from '@/utils/SubscribeMessage.js';
	import {
		setVisit,
		spread
	} from '@/api/user.js';
	import recommend from '@/components/recommend';
	import {
		openPlantGrass
	} from "@/config/app.js";
	// #ifndef H5
	import passwordPopup from '@/components/passwordPopup';
	// #endif
	// #ifdef MP
	import authorize from '@/components/Authorize';
	// #endif
	import {
		silenceBindingSpread
	} from '@/utils';
	import history from '@/mixins/history';
	import {
		toLogin
	} from '@/libs/login.js';
	import shareScence from '@/libs/spread';
	import presell from './component/presell.vue';
	import hotMenu from './component/hotMenu.vue';
	import brandStore from './component/brandStore.vue';
	import easyLoadimage from '@/components/easy-loadimage/easy-loadimage.vue';


	export default {
		computed: mapGetters(['uid']),
		mixins: [history],
		components: {
			easyLoadimage,
			presell, // 預售组件
			hotMenu, // 热点菜單组件
			brandStore, // 热门店鋪
			tabNav,
			goodList,
			promotionGood,
			couponWindow,
			countDown,
			recommend,
			// #ifndef H5
			passwordPopup,
			// #endif
			// #ifdef MP
			authorize
			// #endif
		},
		data() {
			return {
				isLogin:false,
				open_grass: openPlantGrass,
				showSkeleton: true, //骨架屏显示隐藏
				isNodes: 0, //控制什么時候开始抓取元素节点,只要数值改变就重新抓取
				privacyStatus: false,
				errorNetwork: false,
				countDownHour: '00',
				countDownMinute: '00',
				countDownSecond: '00',
				datatime: '',
				ad: {
					home_ad_pic: ''
				},
				userInfo: '',
				loading: false,
				isAuto: false, //没有授权的不會自动授权
				isShowAuth: false, //是否隐藏授权
				statusBarHeight: statusBarHeight,
				navIndex: 0,
				navTop: [],
				subscribe: false,
				followUrl: '',
				followHid: true,
				followCode: false,
				logoUrl: app.globalData.site_logo,
				// logoUrl: "",
				imgUrls: [{
					url: '',
					pic: '',
					id: '',
					name: ''
				}],
				hot: [],
				sortList: [],
				itemNew: [],
				menus: [{
					url: '',
					pic: '',
					id: '',
					name: ''
				}, {
					url: '',
					pic: '',
					id: '',
					name: ''
				}, {
					url: '',
					pic: '',
					id: '',
					name: ''
				}, {
					url: '',
					pic: '',
					id: '',
					name: ''
				}, {
					url: '',
					pic: '',
					id: '',
					name: ''
				}, {
					url: '',
					pic: '',
					id: '',
					name: ''
				}, {
					url: '',
					pic: '',
					id: '',
					name: ''
				}, {
					url: '',
					pic: '',
					id: '',
					name: ''
				}, {
					url: '',
					pic: '',
					id: '',
					name: ''
				}, {
					url: '',
					pic: '',
					id: '',
					name: ''
				}],
				bastInfo: '',
				fastInfo: '',
				firstInfo: '',
				firstList: [],
				salesInfo: '',
				likeInfo: [],
				benefit: [],
				indicatorDots: false,
				circular: true,
				autoplay: true,
				interval: 3000,
				duration: 500,
				window: false,
				iShidden: false,
				navH: '',
				newGoodsBananr: '',
				couponList: [],
				lovely: [],
				spikeList: [], //秒杀
				liveList: [], //直播
				presellList: [], //預售
				assistList: [], //助力
				assistUserList: [], //已助力数据
				assistUserCount: '',
				combinationList: [],
				plantList: [],
				hotList: [{
						pic: '/static/images/hot_001.png'
					},
					{
						pic: '/static/images/hot_002.png'
					},
					{
						pic: '/static/images/hot_003.png'
					}
				],
				spikeList: [],
				bargList: [],
				ProductNavindex: 0,
				marTop: 0,
				datatime: 0,
				childID: 0,
				loadend: false,
				loading: false,
				loadTitle: this.$t('goods.Load.more'),
				sortProduct: [],
				where: {
					pid: 0,
					page: 1,
					limit: 6
				},
				is_switch: true,
				hostProduct: [],
				hotPage: 1,
				hotLimit: 30,
				hotScroll: true,
				hotLoading: false,
				hotTitle: this.$t('goods.Load.more'),
				explosiveMoney: [],
				prodeuctTop: 0,
				pinkInfo: '',
				searchH: 0,
				isFixed: false,
				goodScroll: true, //精品推薦开關
				params: {
					//精品推薦分頁
					page: 1,
					limit: 10
				},
				tempArr: [], //精品推薦临時数组
				pageInfo: '', // 精品推薦全数据
				site_name: app.globalData.site_name, //首頁title
				swiperCur: 0,
				brandList: [],
				d: '',
				h: '',
				m: '',
				s: '',
				sum_h: '',
				endBg: 'linear-gradient(#666666, #999999)',
				notBg: 'rgb(26, 163, 246)',
				playBg: 'linear-gradient(#FF0000, #FF5400)',
				hide_mer_status: 1,
				community_status: 1,
				sortMarTop: 0,
				globalDatas: {},
				// #ifdef MP 
				mpHeight: 108,
				// #endif
				// #ifndef MP || APP-PLUS
				mpHeight: 0,
				// #endif
				currSpid: '',
				mer_location: '',
				share_title: '',
				_options: {},
				isIntegral: false,
				activity_banner: true,
				activityData: [],
				appUpdate: {},
				appInfo: {},
				copyRightData: "",
				// 初始化一个默认空值，防止报错
				bzArray: [],
				// 当前选中的下标，触发change事件后需要跟着变
				bzIndex: 0,
			};
		},
		/**
		 * 用户点击右上角分享
		 */
		// #ifdef MP
		onShareAppMessage: function() {
			let that = this;
			wx.showShareMenu({
				withShareTicket: true,
				menus: ['shareAppMessage', 'shareTimeline']
			});
			return {
				title: that.share_title,
				path: '/pages/index/index?spid=' + that.uid
			};
		},
		onShareTimeline: function() {
			let that = this;
			return {
				title: that.share_title,
				query: {
					spid: that.uid
				},
				imageUrl: ''
			};
		},
		// #endif
		onLoad(options) {
			this._options = options;

			// #ifdef APP-PLUS
			const pages = getCurrentPages();
			const page = pages[pages.length - 1];
			const currentWebview = page.$getAppWebview();
			currentWebview.setStyle({
				pullToRefresh: {
					support: !this.isSupport,
					style: plus.os.name === 'Android' ? 'circle' : 'default'
				}
			});
			this.isSupport = !this.isSupport;
			this.appVersionConfig(); //APP版本检测
			// #endif
			this.pageLoad(options);
			setTimeout(() => {
				this.isNodes++;
			}, 100);
			this.bzArray = [{
				DEPARTNAME: this.$t('index.lang.en')
			}, {
				DEPARTNAME: this.$t('index.lang.zh-Hant')
			}, {
				DEPARTNAME: this.$t('index.lang.zh-Hans')
			}, {
				DEPARTNAME: this.$t('index.lang.ja')
			}, {
				DEPARTNAME: this.$t('index.lang.th')
			}, {
				DEPARTNAME: this.$t('index.lang.vi')
			}, {
				DEPARTNAME: this.$t('index.lang.id')
			}, {
				DEPARTNAME: this.$t('index.lang.hi')
			}, {
				DEPARTNAME: this.$t('index.lang.tr')
			}, {
				DEPARTNAME: this.$t('index.lang.ar')
			}, {
				DEPARTNAME: this.$t('index.lang.ko')
			}];
			//this.$i18n.locale = 'zh-Hans'
			//uni.setStorageSync('lang', 'zh');
			//,{DEPARTNAME:this.$t('index.lang.vi')},{DEPARTNAME:this.$t('index.lang.id')},{DEPARTNAME:this.$t('index.lang.hi')},{DEPARTNAME:this.$t('index.lang.tr')},{DEPARTNAME:this.$t('index.lang.ar')}

			if (uni.getLocale() == 'en') this.bzIndex = 0
			if (uni.getLocale() == 'zh-Hans') this.bzIndex = 1
			if (uni.getLocale() == 'zh-Hant') this.bzIndex = 2
			if (uni.getLocale() == 'ja') this.bzIndex = 3
			if (uni.getLocale() == 'th') this.bzIndex = 4
			if (uni.getLocale() == 'vi') this.bzIndex = 5
			if (uni.getLocale() == 'id') this.bzIndex = 6
			if (uni.getLocale() == 'hi') this.bzIndex = 7
			if (uni.getLocale() == 'tr') this.bzIndex = 8
			if (uni.getLocale() == 'ar') this.bzIndex = 9
			if (uni.getLocale() == 'ko') this.bzIndex = 10
		},
		onShow() {
			this.getConfig();
			this.syncHeight();
			this.isLogin = this.$store.getters.isLogin()
			// #ifdef H5
			console.log("h5环境")
			if (this.$wechat.isWeixin()) {
				this.isIntegral = uni.getStorageSync('isIntegral')
			}
			// #endif


		},
		onHide() {
			uni.setStorageSync('isIntegral', false)
		},
		onReady() {
			this.syncHeight();
		},
		onNavigationBarButtonTap() {
			console.log("点击了自定义按钮");
		},
		watch: {
			globalDatas(nVal, oVal) {
				// #ifdef H5
				this.ShareInfo(nVal);
				// #endif
			},
			privacyStatus(n) {
				if (n) {
					uni.hideTabBar();
				} else {
					uni.showTabBar();
				}
			},
		},
		onPullDownRefresh() {
			setTimeout(() => {
				uni.stopPullDownRefresh();
			}, 100);
			this.reconnect();
		},
		methods: {
			bindBzChange: function(e) {
				if (e.target.value == 0) {
					uni.setLocale('en');
					this.$i18n.locale = 'en'
				}
				if (e.target.value == 1) {
					uni.setLocale('zh-Hans');
					this.$i18n.locale = 'zh-Hans'
				}
				if (e.target.value == 2) {
					uni.setLocale('zh-Hant');
					this.$i18n.locale = 'zh-Hant'
				}
				if (e.target.value == 3) {
					uni.setLocale('ja');
					this.$i18n.locale = 'ja'
				}
				if (e.target.value == 4) {
					uni.setLocale('th');
					this.$i18n.locale = 'th'
				}
				if (e.target.value == 5) {
					uni.setLocale('vi');
					this.$i18n.locale = 'vi'
				}
				if (e.target.value == 6) {
					uni.setLocale('id');
					this.$i18n.locale = 'id'
				}
				if (e.target.value == 7) {
					uni.setLocale('hi');
					this.$i18n.locale = 'hi'
				}
				if (e.target.value == 8) {
					uni.setLocale('tr');
					this.$i18n.locale = 'tr'
				}
				if (e.target.value == 9) {
					uni.setLocale('ar');
					this.$i18n.locale = 'ar'
				}
				if (e.target.value == 10) {
					uni.setLocale('ko');
					this.$i18n.locale = 'ko'
				}
				//uni.setStorageSync('bzIndex',e.target.value)
				location.reload()
				console.log('picker发送选择改变，携带值为', e.target.value)
				this.bzIndex = e.target.value;
				this.currentDepartId = this.bzArray[this.bzIndex].ORG_CODE;
			},
			pageLoad(options) {
				let that = this;
				if (options.spid) {
					that.currSpid = options.spid;
					app.globalData.spid = options.spid;
				}
				// #ifdef APP-PLUS
				try {
					let val = uni.getStorageSync('privacyStatus') || false;
					if (!val) {
						this.privacyStatus = true;
					}
				} catch (e) {}
				this.snycNetWork();
				// #endif
				// #ifdef MP
				if (options.scene) {
					let value = that.$util.getUrlParams(decodeURIComponent(options.scene));
					if (value.id) options.id = value.id;
					//記錄推广人uid
					if (value.spid) {
						that.currSpid = value.spid;
						app.globalData.spid = value.spid;
					}
				}
				// #endif
				shareScence(that.currSpid, that.isLogin);
				// #ifdef MP
				// 获取小程序头部高度
				this.navH = app.globalData.navHeight;
				let info = uni.createSelectorQuery().select('.mp-header');
				info
					.boundingClientRect(function(data) {
						that.marTop = data.height;
					})
					.exec();
				// #endif
				// #ifndef MP
				this.navH = 0;
				// #endif
				this.isLogin && silenceBindingSpread();
				// this.setVisit()
				Promise.all([
					this.getIndexConfig(),
					this.storeMerchant(),
					this.get_host_product(),
					this.getSpeckillCutTime(),
					this.getSpikeProduct(),
					this.getCombinationProduct(),
					this.getPresellProduct(),
					this.getAssistProduct(),
					this.getAssistUserCount(),
					this.getPlantList()
				]);
				// #ifdef MP
				this.getLiveList();
				// #endif
				if (this.isLogin) {
					this.getUserInfo();
					// #ifdef MP
					this.getHistory();
					// #endif
				}
			},
			/*点击轮播圖跳转*/
			goUrl(url) {
				let isHttp = url.substring(0, 4) == 'http' ? true : false;
				if (isHttp) {
					// #ifdef H5
					location.href = url;
					// #endif
					// #ifndef H5
					uni.switchTab({
						url: url
					});
					// #endif
				} else {
					uni.navigateTo({
						url: url
					});
				}
			},
			goTopicList() {
				uni.navigateTo({
					url: '/pages/activity/topic/index'
				});
			},
			//点击跳转专题详情頁
			goTopicDetail(id) {
				uni.navigateTo({
					url: '/pages/activity/topic_detail/index?id=' + id
				});
			},
			closeShare() {
				uni.setStorageSync('isIntegral', false);
				this.isIntegral = uni.getStorageSync('isIntegral');
			},
			// 重新链接
			reconnect() {
				uni.getNetworkType({
					success: res => {
						this.errorNetwork = res.networkType === 'none';
						if (!this.errorNetwork) {
							this.pageLoad(this._options);
						}
					}
				});
			},
			syncHeight() {
				let self = this;
			},
			// #ifdef APP-PLUS
			snycNetWork() {
				uni.getNetworkType({
					success: res => {
						this.errorNetwork = res.networkType === 'none';
					}
				});
			},
			// 同意隐私協议
			confirmApp() {
				uni.setStorageSync('privacyStatus', true);
				this.privacyStatus = false;
			},
			// 關闭Model
			closeModel() {
				this.privacyStatus = false;
			},
			// #endif
			// 微信登錄回调
			onLoadFun: function(e) {
				this.isShowAuth = false;
			},
			setViewport(content) {
				const meta = document.querySelector('meta[name=viewport]');
				if (!meta) return;
				meta.setAttribute('content', content);
			},
			// 菜單详情
			goMenuDetail(item) {
				
				// let url = this.$util.stringIntercept(item.url, 0, "\?")
				if (item.url == '/pages/goods_cate/goods_cate') {
					let data = this.$util.stringIntercept(item.url, 1, '\?');
					data = this.$util.stringIntercept(data, 1, '\=');
					uni.setStorageSync('storeIndex', data);
					uni.switchTab({
						url: '/pages/goods_cate/goods_cate'
					});
				} else if (item.web_url != '' && item.web_url != '') {
					// #ifdef APP-PLUS
					plus.runtime.openURL(item.web_url) //这里默认使用外部浏览器打开而不是内部web-view组件打开
					// #endif
					// #ifdef H5
					window.open(item.web_url)
					// #endif
				} else {
					uni.navigateTo({
						url: item.url
					});
				}
			},
			// #ifdef APP-PLUS
			appVersionConfig() {
				var that = this;
				//app升级
				// 获取本地应用資源版本號  
				getAppVersion().then(res => {
					
					
					plus.runtime.getProperty(plus.runtime.appid, function(inf) {

						
						let nowVersion = (inf.version).split('.').join('');
						let appVersion = (res.data.appVersion).split('.').join('');
						let versionCode = inf.versionCode
						
						

						if (appVersion > nowVersion) {


							let updateInfo = {
								platform: 'android',
								updateContent: res.data.updateContent,
								downUrl: res.data.apk_address,
								version: res.data.appVersion,
								force: true,
								mainColor: 'FF5B78',
							}
							appUpdate(updateInfo)

						} else if (res.data.hotVersion > versionCode) {
							uni.downloadFile({
								url: res.data.wgt_address,
								success: (downloadResult) => {
									if (downloadResult.statusCode === 200) {

										plus.runtime.install(downloadResult.tempFilePath, {
											force: true //true表示强制安装，不进行版本号的校验；false则需要版本号校验，如果将要安装应用的版本号不高于现有应用的版本号则终止安装，并返回安装失败。 仅安装wgt和wgtu时生效，默认值 false。
										}, function() {
											
											plus.runtime.restart();
										}, function(e) {
											console.log(e)
											
										});
									}
								}
							});
						}
					});
				})
			},
			// #endif
			getConfig() {
				// 获取配置
				getconfig()
					.then(res => {
						let self = this;
						this.globalDatas = res.data;
						this.logoUrl = res.data.site_logo;
						this.site_name = res.data.site_name;
						this.hide_mer_status = res.data.hide_mer_status;
						this.community_status = res.data.community_status;
						this.mer_location = res.data.mer_location;
						this.share_title = res.data.share_title;
						this.copyRightData = res.data.beian_sn;
						//#ifndef APP-PLUS
						uni.setNavigationBarTitle({
							title: self.site_name
						});
						//#endif
						uni.$emit('configData', res.data);
					})
					.catch(err => {});
			},
			// 分類頁更多
			bindMore(item) {
				console.log(this.navTop[this.navIndex]);
				try {
					uni.setStorageSync('storeIndex', this.navTop[this.navIndex].pid);
					uni.switchTab({
						url: '/pages/goods_cate/goods_cate'
					});
				} catch (e) {}
			},
			goDetails(item) {
				goShopDetail(item, this.uid).then(res => {
					if (this.isLogin) {
						initiateAssistApi(item.activity_id)
							.then(res => {
								let id = res.data.product_assist_set_id;
								uni.hideLoading();
								// #ifndef MP
								uni.navigateTo({
									url: '/pages/activity/assist_detail/index?id=' + id
								});
								// #endif
								// #ifdef MP
								openBargainSubscribe()
									.then(res => {
										uni.hideLoading();
										uni.navigateTo({
											url: '/pages/activity/assist_detail/index?id=' + id
										});
									})
									.catch(err => {
										uni.hideLoading();
									});
								// #endif
							})
							.catch(err => {
								uni.showToast({
									title: err,
									icon: 'none'
								});
							});
					} else {
						// #ifdef H5 || APP-PLUS
						toLogin();
						// #endif
						// #ifdef MP
						this.$emit('isShowAuth', true);
						this.$emit('isAuto', true);
						// #endif
					}
				});
			},
			/**
			 * 获取個人用户資訊
			 */
			getUserInfo: function() {
				let that = this;
				getUserInfo().then(res => {
					that.userInfo = res.data;
				});
			},
			// 品牌好店
			storeMerchant() {
				storeMerchantList({
					page: 1,
					limit: 3,
					lang: uni.getLocale(),
					is_best: 1
				}).then(res => {
					this.brandList = res.data.list;
				});
			},
			// 获取秒杀截止時間
			getSpeckillCutTime() {
				getSeckillIndexTime().then(res => {
					this.datatime = res.data.seckillEndTime ? res.data.seckillEndTime : '';
				});
			},
			// 获取秒杀商品
			getSpikeProduct() {
				let that = this;
				getSeckillList({
						limit: 10,
						lang: uni.getLocale()
					})
					.then(res => {
						that.spikeList = res.data.list;
						that.spikeList.map(item => {
							item.percent = item.stock === 0 ? '0%' : ((item.sales * 100) / item.stock).toFixed(
								2) + '%';
						});
					})
					.catch(e => {});
			},
			// #ifdef MP
			// 直播
			getLiveList() {
				let that = this;
				getLiveList({
						limit: 10
					})
					.then(res => {
						that.liveList = res.data.list;
						that.liveList.forEach(val => {
							val.link =
								(val.live_status == 103 && val.replay_status) || val.live_status === 101 || val
								.live_status === 102 ?
								'plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=' + val
								.room_id :
								'';
						});
					})
					.catch(e => {});
			},
			// #endif
			// 拼团
			getCombinationProduct() {
				let that = this;
				getCombinationList({
						limit: 3,
						lang: uni.getLocale()
					})
					.then(res => {
						that.combinationList = res.data.list;
					})
					.catch(e => {});
			},
			// 預售
			getPresellProduct() {
				let that = this;
				getPresellList({
						limit: 10,
						lang: uni.getLocale()
					})
					.then(res => {
						that.presellList = res.data.list;
					})
					.catch(e => {});
			},
			// 种草
			getPlantList() {
				let that = this;
				graphicLstApi({
						limit: 10,
						lang: uni.getLocale()
					})
					.then(res => {
						that.plantList = res.data.list;
					})
					.catch(e => {});
			},
			// 助力
			getAssistProduct() {
				let that = this;
				getAssistList({
						limit: 10,
						lang: uni.getLocale()
					})
					.then(res => {
						that.assistList = res.data.list;
					})
					.catch(e => {});
			},
			// 获取已助力成功数据
			getAssistUserCount() {
				let that = this;
				assistUserData()
					.then(res => {
						that.assistUserCount = res.data.count;
						that.assistUserList = res.data.list;
					})
					.catch(e => {});
			},
			handleAssist(id) {
				if (this.isLogin) {
					initiateAssistApi(id)
						.then(res => {
							let id = res.data.product_assist_set_id;
							uni.hideLoading();
							// #ifndef MP
							uni.navigateTo({
								url: '/pages/activity/assist_detail/index?id=' + id
							});
							// #endif
							// #ifdef MP
							openBargainSubscribe()
								.then(res => {
									uni.hideLoading();
									uni.navigateTo({
										url: '/pages/activity/assist_detail/index?id=' + id
									});
								})
								.catch(err => {
									uni.hideLoading();
								});
							// #endif
						})
						.catch(err => {
							uni.showToast({
								title: err,
								icon: 'none'
							});
						});
				} else {
					// #ifdef H5 || APP-PLUS
					toLogin();
					// #endif
					// #ifdef MP
					this.isAuto = true;
					this.$set(this, 'isShowAuth', true);
					// #endif
				}
			},
			// swiper
			swiperChange(e) {
				// this.swiperCur = e.detail.current
				let {
					current,
					source
				} = e.detail;
				if (source === 'autoplay' || source === 'touch') {
					//根据官方 source 来进行判断swiper的change事件是通過什么来触发的，autoplay是自动轮播。touch是用户手动滑动。其他的就是未知问题。抖动问题主要由于未知问题引起的，所以做了限制，只有在自动轮播和用户主动触发才去改变current值，达到规避了抖动bug
					this.swiperCur = e.detail.current;
				}
			},
			// 記錄會员访问
			setVisit() {
				setVisit({
					url: '/pages/index/index'
				}).then(res => {
					console.log(res);
				});
			},
			// 导航分類切换
			changeTab(e) {
				let self = this;
				if (this.navIndex == e.index) return;
				this.navIndex = e.index;
				if (e.index > 0) {
					storeCategory({
						pid: e.pid,
						lang: uni.getLocale()
					}).then(res => {
						if (uni.getLocale() == 'en') {
							res.data.forEach(val => {
								val.cate_name = val.cate_name_en;
							});
						}
						this.sortList = res.data.length > 9 ? res.data.splice(0, 9) : res.data;
						if (this.sortList.length > 0) {
							this.where.pid = e.pid;
							this.where.page = 1;
							this.loadend = false;
							this.loading = false;
							this.sortProduct = [];
							this.get_product_list();
						}
					});

					// #ifdef MP || APP-PLUS
					setTimeout(res => {
						let info = uni.createSelectorQuery().select('.mp-header');
						info.boundingClientRect(function(data) {
								//data - 各种参数
								self.sortMarTop = data.height + 10;

								console.log(self.sortMarTop, 'self.sortMarTop');
							})
							.exec();
					}, 0);
					// #endif
					// #ifdef H5
					self.sortMarTop = 10;
					// #endif
				}
			},
			//分類产品
			get_product_list: function() {
				console.log("---------------------------------------");
				let that = this;
				// if (!that.loadend) return;
				if (that.loading) return;
				that.loading = true;
				that.loadTitle = '';
				getProductslist(that.where)
					.then(res => {
						let list = res.data.list;
						let productList = that.$util.SplitArray(list, that.sortProduct);
						let loadend = list.length < that.where.limit;
						that.loadend = loadend;
						that.loading = false;
						that.loadTitle = loadend ? this.$t('goods.All.loaded') : this.$t('goods.Load.more');
						that.$set(that, 'sortProduct', productList);
						that.$set(that.where, 'page', that.where.page + 1);
					})
					.catch(err => {
						that.loading = false;
						that.loadTitle = this.$t('goods.Load.more');
					});
			},
			/**
			 * 获取我的推薦
			 */
			get_host_product: function() {
				let that = this;
				let num = that.hotLimit;
				if (!that.hotScroll) return;
				if (that.hotLoading) return;
				that.hotLoading = true;
				that.hotTitle = '';
				getProductHot(that.hotPage, that.hotLimit).then(res => {
					let list = res.data.list;
					let productList = that.$util.SplitArray(list, that.hostProduct);
					let hotScroll = list.length <= num && list.length != 0;
					that.hotScroll = hotScroll;
					that.hotLoading = false;
					that.hotTitle = !hotScroll ? this.$t('goods.All.loaded') : this.$t('goods.Load.more');
					that.$set(that, 'hostProduct', productList);
					that.$set(that, 'hotPage', that.hotPage + 1);
				});
			},
			// 首頁数据
			getIndexConfig: function() {
				let that = this;
				getIndexData().then(res => {
					that.$set(that, 'imgUrls', res.data.banner);
					if (uni.getLocale() == 'en') {
						res.data.category.forEach(val => {
							val.cate_name = val.cate_name_en;
						});
						res.data.menu.forEach(val => {
							val.name = val.name_en;
						});
						res.data.hot.forEach(val => {
							val.title = val.s_title;
						});
					}
					that.$set(that, 'menus', res.data.menu);
					that.$set(that, 'hot', res.data.hot);
					that.$set(that, 'ad', res.data.ad);
					that.$set(that, 'activityData', res.data.activity_lst || []);
					res.data.category.unshift({
						cate_name: this.$t('index.home')
					});
					that.$set(that, 'navTop', res.data.category);
					that.lovely = res.data.lovely;
					that.$set(that, 'pageInfo', res.data);
					that.$set(that, 'likeInfo', res.data.likeInfo);
					that.$set(that, 'benefit', res.data.benefit);
					that.explosiveMoney = res.data.explosive_money;
					// #ifdef H5
					that.subscribe = res.data.subscribe;
					// #endif
					// 小程序判断用户是否授权；
					// #ifdef MP
					uni.getSetting({
						success(res) {
							if (!res.authSetting['scope.userInfo']) {
								that.window = that.couponList.length ? true : false;
							} else {
								that.window = false;
								that.iShidden = true;
							}
						}
					});
					// #endif
					// #ifndef MP
					if (that.isLogin) {
						that.window = false;
					} else {
						that.window = that.couponList.length ? true : false;
					}
					// #endif

					that.syncHeight();
					that.reloadData();
				});
			},
			reloadData() {
				setTimeout(() => {
					this.showSkeleton = false
				}, 500)
			},
			// 授权關闭
			authColse: function(e) {
				this.isShowAuth = e;
			},
			// 首发新品详情
			goDetail(item) {
				if (item.activity && item.activity.type === '2' && !this.isLogin) {
					// #ifdef H5
					uni.showModal({
						title: this.$t('indx.tip'),
						content: this.$t('indx.login'),
						success: function(res) {
							if (res.confirm) {
								uni.navigateTo({
									url: '/pages/users/login/index'
								});
							} else if (res.cancel) {}
						}
					});
					// #endif
					// #ifdef MP
					this.$set(this, 'isAuto', true);
					this.$set(this, 'isShowAuth', true);
					// #endif
					return;
				} else {
					goShopDetail(item, this.uid).then(res => {
						uni.navigateTo({
							url: `/pages/goods_details/index?id=${item.id}`
						});
					});
				}
			},
			// 分類详情
			godDetail(item) {
				uni.navigateTo({
					url: `/pages/goods_details/index?id=${item.id}`
				});
			},
			//拼团详情
			goCombinDetail(item) {
				uni.navigateTo({
					url: `/pages/activity/combination_details/index?id=${item.product_group_id}`
				});
			},
			countTime: function() {
				// 获取当前時間
				var date = new Date();
				var now = date.getTime();
				//设置截止時間
				var endDate = new Date('2020-10-22 23:23:23');
				var end = endDate.getTime();
				//時間差
				var leftTime = end - now;
				//定义变量 d,h,m,s保存倒計時的時間
				if (leftTime >= 0) {
					this.d = Math.floor(leftTime / 1000 / 60 / 60 / 24);
					this.h = Math.floor((leftTime / 1000 / 60 / 60) % 24);
					this.m = Math.floor((leftTime / 1000 / 60) % 60);
					this.s = Math.floor((leftTime / 1000) % 60);
					this.sum_h = this.d * 24 + this.h;
				}
				// console.log(this.h)
				// console.log(this.m)
				// console.log(this.s)
				// console.log(this.s);
				//递归每秒调用countTime方法，显示动态時間效果
				setTimeout(this.countTime, 1000);
			},
			//#ifdef H5
			ShareInfo(datas) {
				let data = this.storeInfo;
				let href = location.href;
				if (this.$wechat.isWeixin()) {
					if (this.isLogin) {
						href = href.indexOf('?') === -1 ? href + '?spid=' + this.uid : href + '&spid=' + this.uid;
					} else {
						href = href;
					}
					let configAppMessage = {
						desc: datas.share_info,
						title: datas.share_title,
						link: href,
						imgUrl: datas.share_pic
					};

					this.$wechat
						.wechatEvevt(['updateAppMessageShareData', 'updateTimelineShareData', 'onMenuShareAppMessage',
							'onMenuShareTimeline'
						], configAppMessage)
						.then(res => {
							console.log(res, '=============================>>WXAPI');
						})
						.catch(err => {
							console.log(err);
						});
				}
			},
			//#endif

		},
		mounted() {
			let self = this;
			// #ifdef H5
			// 获取H5 搜索框高度
			setTimeout(() => {
				let appSearchH = uni.createSelectorQuery().select('.serch-wrapper');
				appSearchH
					.boundingClientRect(function(data) {
						self.searchH = data.height;
					})
					.exec();
			}, 800);
			// #endif
		},
		// 滚动到底部
		onReachBottom() {
			console.log('到底了');
			if (this.navIndex == 0) {
				// 首頁加载更多
				this.get_host_product();
			} else {
				// 分類栏目加载更多
				if (this.sortProduct.length > 0) {
					this.get_product_list();
				} else {
					this.get_host_product();
				}
			}
		},
		// 滚动监听
		onPageScroll(e) {
			// #ifdef H5
			let self = this;
			if (e.scrollTop >= (self.searchH + 5)) {
				self.isFixed = true;
			} else {
				self.isFixed = false;
			}
			// #endif
			// 傳入scrollTop值並触发所有easy-loadimage组件下的滚动监听事件
			uni.$emit('scroll');
		}
	};
</script>
<style>
	page {
		display: flex;
		flex-direction: column;
		height: 100%;
		/* #ifdef H5 */
		background-color: #fff;
		/* #endif */
	}
</style>
<style lang="scss">
	@import './style/main.scss';

	.privacy-wrapper {
		z-index: 999;
		position: fixed;
		left: 0;
		top: 0;
		bottom: 0;
		right: 0;
		width: 100%;
		height: 100%;
		background: #7f7f7f;

		.privacy-box {
			position: absolute;
			left: 50%;
			top: 50%;
			transform: translate(-50%, -50%);
			width: 560rpx;
			padding: 50rpx 45rpx 0;
			background: #fff;
			border-radius: 20rpx;

			.title {
				text-align: center;
				font-size: 32rpx;
				text-align: center;
				color: #333;
				font-weight: 700;
			}

			.content {
				margin-top: 20rpx;
				line-height: 1.5;
				font-size: 26rpx;
				color: #666;

				navigator {
					display: inline-block;
					color: #e93323;
				}
			}

			.btn-box {
				margin-top: 40rpx;
				text-align: center;
				font-size: 30rpx;

				.btn-item {
					height: 82rpx;
					line-height: 82rpx;
					background: linear-gradient(90deg, #f67a38 0%, #f11b09 100%);
					color: #fff;
					border-radius: 41rpx;
				}

				.btn {
					padding: 30rpx 0;
				}
			}
		}
	}

	.copyRight {
		margin: 60rpx auto 20rpx;
		max-width: 690rpx;
		font-size: 20rpx;
		color: #707070;
		text-decoration: none;
	}

	.item_tags {
		margin-top: 8rpx;
	}

	.item_tags .tags_item {
		display: inline-block;
		font-size: 20rpx;
		text-align: center;
		border-radius: 5rpx;
		padding: 0 4rpx;
		line-height: 28rpx;
		margin-right: 8rpx;

	}

	.item_tags .tags_item.ticket {
		color: #E93323;
		border: 1rpx solid #E93323;
	}

	.item_tags .tags_item.delivery {
		color: #FF9000;
		border: 1rpx solid #FF9000;
	}

	.share-box {
		z-index: 1000;
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.error-network {
		position: fixed;
		left: 0;
		top: 0;
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 100%;
		height: 100%;
		padding-top: 40rpx;
		background: #fff;
		padding-top: 30%;

		image {
			width: 414rpx;
			height: 336rpx;
		}

		.title {
			position: relative;
			top: -40rpx;
			font-size: 32rpx;
			color: #666;
		}

		.con {
			font-size: 24rpx;
			color: #999;

			.label {
				margin-bottom: 20rpx;
			}

			.item {
				margin-bottom: 20rpx;
			}
		}

		.btn {
			display: flex;
			align-items: center;
			justify-content: center;
			width: 508rpx;
			height: 86rpx;
			margin-top: 100rpx;
			border: 1px solid #d74432;
			color: #e93323;
			font-size: 30rpx;
			border-radius: 120rpx;
		}
	}

	.area-row {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		display: block;
		width: 100%;
		text-align: center;
	}

	.seckill-count,
	.assist-count {
		background-color: #fff;
		margin-bottom: 20rpx;
		border-radius: 16rpx;
		padding: 24rpx 0 26rpx 20rpx;
		box-shadow: 4rpx 2rpx 12rpx 2rpx rgba(0, 0, 0, 0.03);
	}

	.seckill-count .spike-bd {
		padding-left: 10rpx;
	}

	.assist-count {
		padding: 20rpx 0 26rpx 0;
	}

	.wapper_count {
		padding: 0 0 26rpx 20rpx;
	}

	.combination-count {
		background-color: #fff;
		margin-bottom: 11px;
		border-radius: 16rpx;
		box-shadow: 2px 1px 6px 1px rgba(0, 0, 0, 0.03);
		padding: 25rpx 0;
		position: relative;

		.combination_wrapper {
			padding: 0 20rpx;
		}

		.spike-wrapper {
			overflow: hidden;
			width: 670rpx;
		}
	}

	::v-deep.spike-box .styleAll {
		display: inline-block;
		width: 44rpx;
		height: 40rpx;
		line-height: 40rpx;
		padding: 0;
		text-align: center;
		border-radius: 8rpx;
	}

	.activity_count {
		margin-bottom: 20rpx;
		line-height: 0;
		width: 710rpx;
		background: #ffffff;
		padding: 20rpx 0;
		border-radius: 16rpx;
		position: relative;

		::v-deepswiper-item,
		uni-swiper-item,
		swiper {
			height: 278rpx;
		}

		::v-deepuni-image,
		::v-deepimage,
		::v-deep.easy-loadimage {
			width: 650rpx;
			height: 278rpx;
			border-radius: 16rpx;
		}

		.more-btn {
			top: 13rpx;
		}

		::v-deep.uni-swiper-wrapper {
			overflow: hidden;
		}
	}

	.topic_swiper {
		width: 650rpx;
		margin: 0 auto;

	}

	.page-index {
		display: flex;
		flex-direction: column;
		min-height: 100%;
		background: #f5f5f5;

		.adlist {
			margin: 10rpx auto 20rpx auto;

			.ad {
				width: 100%;
				/* width: 100%; //宣传图片无边框*/
				/* width: 700px; //宣传图片像素*/
				height: auto;
				margin: 0 auto;

				image {
					width: 100%;
					height: 100%;
					display: block;
				}
			}
		}

		.header {
			width: 100%;
			background: #ffffff00;
			z-index: 99999;
			position: absolute;

			.btn {
				position: relative;
				visibility: hidden;

				.iconfont {
					font-size: 45rpx;
				}
			}

			.iconnum {
				min-width: 6px;
				color: #fff;
				border-radius: 15rpx;
				position: absolute;
				right: -10rpx;
				top: -10rpx;
				font-size: 10px;
				padding: 0 4px;
			}

			.serch-wrapper {
				align-items: center;
				padding: 20rpx 30rpx 0 30rpx;

				.logo {
					width: 70rpx;
					height: 70rpx;
				}

				image {
					width: 118rpx;
					height: 42rpx;
				}

				.input,
				.uninput {
					display: flex;
					align-items: center;
					max-width: 490rpx;
					min-width: 460rpx;
					height: 64rpx;
					padding: 0 0 0 30rpx;
					background: rgba(237, 237, 237, 1);
					border: 1px solid rgba(241, 241, 241, 1);
					border-radius: 32rpx;
					color: #bbbbbb;
					font-size: 28rpx;

					.iconfont {
						margin-right: 20rpx;
					}
				}

				.uninput {
					min-width: 610rpx;
					max-width: 620rpx;
				}
			}

			.tabNav {
				padding-top: 24rpx;
			}
		}

		/*直播*/
		.live-count {
			background-color: #fff;
			margin-bottom: 20rpx;
			border-radius: 16rpx;
			padding: 20rpx 0 26rpx 20rpx;
			box-shadow: 4rpx 2rpx 12rpx 2rpx rgba(0, 0, 0, 0.03);
		}

		.plant-count {
			background: #ffffff;
			border-radius: 16rpx;
			box-shadow: 4rpx 2rpx 12rpx 2rpx rgba(0, 0, 0, 0.03);
		}

		.live-wrapper {
			position: relative;
			width: 100%;
			overflow: hidden;
			border-radius: 16rpx;

			image {
				width: 100%;
				height: 400rpx;
			}

			.live-top {
				z-index: 20;
				position: absolute;
				left: 0;
				top: 0;
				display: flex;
				align-items: center;
				justify-content: center;
				color: #fff;
				width: 120rpx;
				height: 32rpx;

				&.playRadius {
					border-radius: 0;
				}

				&.notPlayRadius {
					border-radius: 0rpx 0px 18rpx 0px;
				}

				image {
					width: 30rpx;
					height: 30rpx;
					margin-right: 6rpx;
					/* #ifdef H5 */
					display: block;
					/* #endif */
				}
			}

			.broadcast-time {
				z-index: 20;
				position: absolute;
				left: 110rpx;
				top: 0;
				display: flex;
				align-items: center;
				justify-content: center;
				color: #fff;
				width: 160rpx;
				height: 36rpx;
				background: rgba(0, 0, 0, 0.4);
				font-size: 22rpx;
				border-radius: 0 0 18rpx 0;
			}

			.live-title {
				position: absolute;
				left: 0;
				bottom: 6rpx;
				width: 100%;
				height: 70rpx;
				line-height: 70rpx;
				text-align: center;
				font-size: 30rpx;
				color: #fff;
				background: rgba(0, 0, 0, 0.35);
			}

			&.mores {
				width: 100%;

				.item {
					position: relative;
					width: 280rpx;
					height: 224rpx;
					display: inline-block;
					border-radius: 16rpx;
					overflow: hidden;
					margin-right: 20rpx;

					image {
						width: 320rpx;
						height: 180rpx;
						border-radius: 16rpx;
					}

					.live-title {
						height: 40rpx;
						line-height: 40rpx;
						text-align: center;
						font-size: 22rpx;
					}

					.live-top {
						width: 110rpx;
						height: 32rpx;
						font-size: 22rpx;

						image {
							width: 20rpx;
							height: 20rpx;
						}
					}
				}
			}

			&.plant {
				padding: 20rpx;

				.item {
					position: relative;
					width: 280rpx;
					height: 280rpx;
					display: inline-block;
					border-radius: 16rpx;
					overflow: hidden;
					margin-right: 20rpx;

					::v-deepimage,
					.easy-loadimage,
					uni-image {
						width: 280rpx;
						height: 280rpx;
						border-radius: 16rpx;
					}

					&::before {
						content: "";
						display: block;
						width: 280rpx;
						height: 280rpx;
						background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 100%);
						position: absolute;
						top: 0;
						left: 0;
						z-index: 10;
					}

					.item_text {
						width: 260rpx;
						padding: 17rpx 15rpx;
						position: absolute;
						left: 0;
						bottom: 0;
						color: #ffffff;
						z-index: 12;

						image {
							width: 34rpx;
							height: 34rpx;
							border-radius: 100%;
						}

						.text_name {
							font-size: 24rpx;
							width: 260rpx;
							word-break: normal;
							word-wrap: break-word;
							display: block;
						}

						.text_count {
							margin-top: 12rpx;
							align-items: center;

							.name {
								font-size: 18rpx;
								margin-left: 10rpx;
								max-width: 200rpx;
							}
						}
					}
				}
			}
		}

		/* #ifdef MP */
		.mp-header {
			z-index: 999;
			position: fixed;
			left: 0;
			top: 0;
			width: 100%;
			/* #ifdef H5 */
			padding-bottom: 20rpx;
			/* #endif */
			// background: linear-gradient(90deg, $bg-star 50%, $bg-end 100%);
			background-color: #fff;

			.serch-wrapper {
				height: 100%;
				align-items: center;
				padding: 0 50rpx 0 53rpx;

				image {
					width: 118rpx;
					height: 42rpx;
					margin-right: 30rpx;
				}

				.input,
				.uninput {
					display: flex;
					align-items: center;
					/* #ifndef APP-PLUS */
					width: 305rpx;
					/* #endif */
					/* #ifdef APP-PLUS */
					flex: 1;
					/* #endif */
					height: 58rpx;
					padding: 0 0 0 30rpx;
					background: rgba(247, 247, 247, 1);
					border: 1px solid rgba(241, 241, 241, 1);
					border-radius: 29rpx;
					color: #bbbbbb;
					font-size: 28rpx;

					.iconfont {
						margin-right: 20rpx;
					}
				}

				.uninput {
					min-width: 460rpx;
					max-width: 480rpx;
				}
			}
		}

		/* #endif */
		.page_swiper {
			position: relative;
			width: 100%;
			/* #ifdef MP  */
			height: auto;
			/* #endif */
			/* #ifdef H5 || APP-PLUS */
			height: 320rpx;
			/* #endif */
			margin: 0 auto;
			border-radius: 10rpx;
			overflow-x: hidden;
			/* #ifdef MP */
			z-index: 10;
			/* #endif */

			.swiper-item,
			image,
			.acea-row.row-between-wrapper {
				width: 100%;
				height: 100%;

				margin: 0 auto;
				border-radius: 10rpx;
			}

			image {
				transform: scale(0.93);
				transition: all 0.6s ease;
			}

			swiper-item.active {
				image {
					transform: scale(1);
				}
			}
		}

		.page_content {
			/* #ifdef MP */
			padding-top: 270rpx;

			/* #endif */
			.page_bg {
				background: linear-gradient(180deg, #fff 0%, #f5f5f5 100%);

				.acea-row {
					background: url(/static/images/index_nav_bg15.png) no-repeat;
					// background-size: 380px;
					background-size: 100%;
					border-radius: 5px;
				}
			}


			.nav {
				padding: 0 0rpx 30rpx;
				flex-wrap: wrap;
				/* #ifdef MP */
				margin-top: 0;
				/* #endif */
				/* #ifdef H5 */
				margin-top: 0;

				/* #endif */
				.item {
					display: flex;
					flex-direction: column;
					align-items: center;
					justify-content: center;
					width: 20%;
					margin-top: 30rpx;

					image {
						width: 82rpx;
						height: 82rpx;
					}
				}
			}

			.live-wrapper {
				position: relative;
				width: 100%;
				overflow: hidden;
				border-radius: 16rpx;

				image {
					width: 100%;
					height: 400rpx;
				}

				.live-top {
					z-index: 20;
					position: absolute;
					left: 0;
					top: 0;
					display: flex;
					align-items: center;
					justify-content: center;
					color: #fff;
					width: 110rpx;
					height: 36rpx;

					&.playRadius {
						border-radius: 0;
					}

					&.notPlayRadius {
						border-radius: 0rpx 0px 18rpx 0px;
					}

					image {
						width: 30rpx;
						height: 30rpx;
						margin-right: 10rpx;
						/* #ifdef H5 */
						display: block;
						/* #endif */
					}
				}

				.live-title {
					position: absolute;
					left: 0;
					bottom: 6rpx;
					width: 100%;
					height: 36rpx;
					line-height: 36rpx;
					text-align: center;
					font-size: 22rpx;
					color: #fff;
					background: rgba(0, 0, 0, 0.35);
				}

				&.mores {
					width: 100%;

					.item {
						position: relative;
						width: 280rpx;
						display: inline-block;
						border-radius: 16rpx;
						overflow: hidden;
						margin-right: 20rpx;

						image {
							width: 280rpx;
							height: 224rpx;
							border-radius: 16rpx;
						}

						.live-title {
							height: 36rpx;
							line-height: 36rpx;
							text-align: center;
							font-size: 22rpx;
						}

						.live-top {
							width: 110rpx;
							height: 36rpx;
							font-size: 22rpx;

							image {
								width: 20rpx;
								height: 20rpx;
							}
						}
					}
				}
			}

			.spike-box {
				margin-top: 20rpx;
				padding: 23rpx 20rpx;
				border-radius: 24rpx;
				background-color: #fff;
				overflow: hidden;
				box-shadow: 0px 0px 16px 3px rgba(0, 0, 0, 0.04);

				.hd {
					display: flex;
					align-items: center;
					justify-content: space-between;

					.left {
						display: flex;
						align-items: center;
						width: 500rpx;

						.icon {
							width: 38rpx;
							height: 38rpx;
							margin-right: 8rpx;
						}

						.title {
							width: 134rpx;
							height: 33rpx;
						}
					}

					.more {
						font-size: 26rpx;
						color: #999;

						.iconfont {
							margin-left: 6rpx;
							font-size: 25rpx;
						}
					}
				}

				.spike-wrapper {
					width: 100%;
					margin-top: 27rpx;

					.spike-item {
						display: inline-block;
						width: 222rpx;
						margin-right: 20rpx;

						.img-box {
							position: relative;
							height: 222rpx;

							image {
								width: 100%;
								height: 222rpx;
								border-radius: 16rpx;
							}

							.msg {
								position: absolute;
								left: 10rpx;
								bottom: 16rpx;
								width: 86rpx;
								height: 30rpx;
								background: rgba(255, 255, 255, 1);
								border: 1px solid rgba(255, 109, 96, 1);
								border-radius: 6rpx;
								font-size: 20rpx;
								color: $theme-color;
							}
						}

						.info {
							margin-top: 8rpx;
							padding: 0 10rpx;

							.name {
								font-size: 28rpx;
							}

							.price-box {
								display: flex;
								align-items: center;
								justify-content: center;

								.tips {
									display: flex;
									align-items: center;
									justify-content: center;
									width: 28rpx;
									height: 28rpx;
									background-color: $theme-color;
									color: #fff;
									font-size: 20rpx;
									border-radius: 2px;
								}

								.price {
									display: flex;
									margin-left: 10rpx;
									color: $theme-color;
									font-size: 28rpx;
									font-weight: bold;

									text {
										font-size: 18rpx;
									}
								}
							}
						}
					}
				}
			}

			.barg {
				width: 100%;
				height: 478rpx;
				margin-top: 20rpx;
				padding-left: 20rpx;
				background-size: 100% 100%;

				.title {
					display: flex;
					align-items: center;
					justify-content: center;
					padding-top: 42rpx;

					image {
						width: 463rpx;
						height: 39rpx;
					}
				}

				.barg-swiper {
					margin-top: 43rpx;
					padding-right: 20rpx;

					.wrapper {
						display: flex;
					}

					.list-box {
						flex-shrink: 0;
						width: 210rpx;
						background-color: #fff;
						border-radius: 16rpx;
						overflow: hidden;
						padding-bottom: 18rpx;
						margin-right: 20rpx;

						image {
							width: 100%;
							height: 210rpx;
						}

						.info-txt {
							width: 100%;
							display: flex;
							flex-direction: column;
							align-items: center;
							justify-content: center;
							padding-top: 15rpx;

							.price {
								font-weight: 700;
								color: $theme-color;
							}

							.txt {
								display: flex;
								align-items: center;
								justify-content: center;
								width: 136rpx;
								height: 33rpx;
								margin-top: 10rpx;
								background: linear-gradient(90deg, $bg-star 0%, $bg-end 100%);
								border-radius: 17px;
								font-size: 22rpx;
								color: #fff;
							}
						}
					}

					.more-box {
						flex-shrink: 0;
						display: flex;
						flex-direction: column;
						align-items: center;
						justify-content: center;
						width: 80rpx;
						background-color: #fff;
						border-radius: 16rpx;

						image {
							width: 24rpx;
							height: 24rpx;
							margin-top: 10rpx;
						}

						.txt {
							display: block;
							writing-mode: vertical-lr;
							font-size: 26rpx;
							line-height: 1.2;
						}
					}
				}
			}

			.group-wrapper {
				padding: 26rpx 20rpx;
				margin-top: 20rpx;
				background: #fff;
				border-radius: 24rpx;

				.hd {
					display: flex;
					align-items: center;
					justify-content: space-between;

					.left {
						display: flex;
						align-items: center;

						.icon {
							width: 38rpx;
							height: 38rpx;
							margin-right: 8rpx;
						}

						.title {
							width: 134rpx;
							height: 33rpx;
						}

						.person {
							display: flex;
							align-items: center;
							margin-left: 40rpx;

							.avatar-box {
								display: flex;
								align-items: center;

								image {
									width: 30rpx;
									height: 30rpx;
									border-radius: 50%;
									margin-right: -10rpx;
								}
							}

							.num {
								margin-left: 18rpx;
								font-size: 26rpx;
								color: #999999;
							}
						}
					}

					.more {
						font-size: 26rpx;
						color: #999;

						.iconfont {
							margin-left: 6rpx;
							font-size: 25rpx;
						}
					}
				}

				.group-scroll {
					width: 100%;
					margin-top: 25rpx;

					.group-item {
						display: inline-block;
						width: 222rpx;
						margin-right: 20rpx;
						box-shadow: 0px 2px 6px 2px rgba(0, 0, 0, 0.03);
						border-radius: 16rpx;

						image {
							width: 100%;
							height: 222rpx;
							border-radius: 16rpx 16rpx 0 0;
						}

						.info {
							padding: 8rpx 13rpx;

							.name {
								font-size: 24rpx;
							}

							.price-box {
								display: flex;
								align-items: center;
								margin-top: 10rpx;

								.tips {
									display: flex;
									align-items: center;
									justify-content: center;
									width: 76rpx;
									height: 30rpx;
									margin-right: 6rpx;
									background: linear-gradient(90deg, rgba(255, 0, 0, 0.1) 0%, rgba(255, 84, 0, 0.1) 100%);
									border-radius: 2px;
									font-size: 20rpx;
									color: $theme-color;
								}

								.price {
									font-size: 26rpx;
									color: $theme-color;
									font-weight: 700;

									text {
										font-size: 20rpx;
									}
								}
							}
						}

						.bom-btn {
							display: flex;
							align-items: center;
							justify-content: center;
							width: 100%;
							height: 48rpx;
							background: linear-gradient(90deg, $bg-star 0%, $bg-end 100%);
							border-radius: 0px 0px 16rpx 16rpx;
							color: #fff;
						}
					}
				}
			}

			.boutique {
				margin-top: 20rpx;

				swiper,
				swiper-item,
				.slide-image {
					width: 100%;
					height: 240rpx;
					border-radius: 12rpx;
				}
			}

			.index-product-wrapper {
				.nav-bd {
					display: flex;
					align-items: center;

					.item {
						display: flex;
						flex-direction: column;
						align-items: center;
						justify-content: center;
						width: 25%;

						.txt {
							font-size: 32rpx;
							color: #282828;
						}

						.label {
							display: flex;
							align-items: center;
							justify-content: center;
							width: 124rpx;
							height: 32rpx;
							margin-top: 5rpx;
							font-size: 24rpx;
							color: #999;
						}

						&.active {
							color: $theme-color;

							.label {
								background: linear-gradient(90deg, $bg-star 0%, $bg-end 100%);
								border-radius: 16rpx;
								color: #fff;
							}
						}
					}
				}

				.list-box {
					display: flex;
					flex-wrap: wrap;
					justify-content: space-between;

					.item {
						width: 345rpx;
						margin-bottom: 20rpx;
						background-color: #fff;
						border-radius: 10px;
						overflow: hidden;

						image {
							width: 100%;
							height: 345rpx;
						}

						.text-info {
							padding: 10rpx 20rpx 15rpx;

							.title {
								color: #222222;
							}

							.old-price {
								margin-top: 8rpx;
								font-size: 26rpx;
								color: #aaaaaa;
								text-decoration: line-through;

								text {
									margin-right: 2px;
									font-size: 20rpx;
								}
							}

							.price {
								display: flex;
								align-items: flex-end;
								color: $theme-color;
								font-size: 34rpx;
								font-weight: 800;

								text {
									padding-bottom: 4rpx;
									font-size: 24rpx;
									font-weight: normal;
								}

								.txt {
									display: flex;
									align-items: center;
									justify-content: center;
									width: 28rpx;
									height: 28rpx;
									margin-left: 15rpx;
									margin-bottom: 10rpx;
									border: 1px solid $theme-color;
									border-radius: 4rpx;
									font-size: 22rpx;
									font-weight: normal;
								}
							}
						}
					}

					&.on {
						display: flex;
					}
				}
			}
		}
	}

	.language {
		height: 26px;
		line-height: 26px;
	}

	.language:before {
		content: '';
		width: 26px;
		height: 26px;
		float: left;
		display: inline-block;
	}

	.language0:before {
		background: url(/static/images/en_us.png) no-repeat;
		background-size: 100%;
	}

	.language1:before {
		background: url(/static/images/zh_cn.png) no-repeat;
		background-size: 100%;
	}

	.language2:before {
		background: url(/static/images/zh_hk.png) no-repeat;
		background-size: 100%;
	}

	.language3:before {
		background: url(/static/images/rb.png) no-repeat;
		background-size: 100%;
	}

	.language4:before {
		background: url(/static/images/th.png) no-repeat;
		background-size: 100%;
	}

	.language5:before {
		background: url(/static/images/vi.png) no-repeat;
		background-size: 100%;
	}

	.language6:before {
		background: url(/static/images/id.png) no-repeat;
		background-size: 100%;
	}

	.language7:before {
		background: url(/static/images/hi.png) no-repeat;
		background-size: 100%;
	}

	.language8:before {
		background: url(/static/images/tr.png) no-repeat;
		background-size: 100%;
	}

	.language9:before {
		background: url(/static/images/ar.png) no-repeat;
		background-size: 100%;
	}

	.language10:before {
		background: url(/static/images/ko.png) no-repeat;
		background-size: 100%;
	}

	.plant_bg {
		margin-bottom: 0;
		border-radius: 0;
		padding: 24rpx 20rpx 27rpx 30rpx;
		background-image: url('');
		background-size: 100% 100%;
		background-repeat: no-repeat;

		.more-btn {
			top: 22rpx;
		}

	}

	.activity_pic {
		margin-left: 20rpx;
		padding-left: 20rpx;
		position: relative;

		&::before {
			content: '';
			display: inline-block;
			width: 2rpx;
			height: 40rpx;
			background: #dcdcdc;
			position: absolute;
			top: 0;
			left: 0;
		}

		.picture {
			display: inline-block;
		}

		.avatar {
			width: 42rpx;
			height: 42rpx;
			line-height: 20rem;
			display: inline-block;
			// background-image: url("/static/images/f.png");
			background-repeat: no-repeat;
			background-size: center/cover;
			// background: #2ddcd3 no-repeat center/cover;
			position: relative;
			text-align: center;
			color: #fff;
			font-weight: 600;
			vertical-align: bottom;
			font-size: 0.875rem;
			-webkit-user-select: none;
			-moz-user-select: none;
			-ms-user-select: none;
			user-select: none;
			border-radius: 50%;
			background-repeat: no-repeat;
			background-size: cover;
			background-position: 0 0;
			margin-right: -10rpx;
			box-shadow: 0 0 0 1px #fff;
		}

		.pic_count {
			margin-left: 30rpx;
			color: #999999;
			font-size: 26rpx;
			position: relative;
			top: -4rpx;
		}
	}

	.productList {
		background-color: #f1f1f1;
		min-height: 70vh;

		.sort {
			width: 710rpx;
			max-height: 380rpx;
			background: rgba(255, 255, 255, 1);
			border-radius: 16rpx;
			padding: 0 0rpx 30rpx;
			flex-wrap: wrap;
			margin: 25rpx auto 0 auto;
			padding-top: 8rpx;

			&.no_pad {
				padding: 0;
			}

			.item {
				width: 20%;
				margin-top: 30rpx;
				text-align: center;

				.pictrues {
					width: 90rpx;
					height: 90rpx;
					background: rgba(248, 248, 248, 1);
					border-radius: 50%;
					margin: 0 auto;
				}

				image {
					width: 90rpx;
					height: 90rpx;
				}

				.text {
					color: #272727;
					font-size: 24rpx;
					margin-top: 10rpx;
					overflow: hidden;
					white-space: nowrap;
					text-overflow: ellipsis;
				}

			}
		}
	}

	.productList .list {
		padding: 0 20rpx;
	}

	.productList .list.on {
		background-color: #fff;
		border-top: 1px solid #f6f6f6;
	}

	.productList .list .item {
		width: 345rpx;
		margin-top: 20rpx;
		background-color: #fff;
		border-radius: 10rpx;

		.name {
			display: flex;
			align-items: center;

			.name_text {
				display: inline-block;
				max-width: 200rpx;
			}
		}
	}

	.productList .list .item.on {
		width: 100%;
		display: flex;
		border-bottom: 1rpx solid #f6f6f6;
		padding: 30rpx 0;
		margin: 0;
	}

	.productList .list .item .pictrue {
		position: relative;
		width: 100%;
		height: 345rpx;
	}

	.productList .list .item .pictrue.on {
		width: 180rpx;
		height: 180rpx;
	}

	.productList .list .item .pictrue image,
	.productList .list .item .pictrue uni-image,
	.productList .list .item .pictrue .easy-loadimage {
		width: 100%;
		height: 100%;
		border-radius: 10rpx 10rpx 0 0;
	}

	.productList .list .item .pictrue image.on {
		border-radius: 6rpx;
	}

	.productList .list .item .text {
		padding: 14rpx 17rpx 26rpx 17rpx;
		font-size: 28rpx;
		color: #212121;
	}

	.productList .list .item .text.on {
		width: 508rpx;
		padding: 0 0 0 22rpx;
	}

	.productList .list .item .text .money {
		font-size: 26rpx;
		font-weight: bold;
		margin-top: 8rpx;
	}

	.productList .list .item .text .coupon {
		background: rgba(255, 248, 247, 1);
		border: 1px solid rgba(233, 51, 35, 1);
		border-radius: 4rpx;
		font-size: 20rpx;
		margin-left: 18rpx;
		padding: 1rpx 4rpx;
	}

	.productList .list .item .text .money.on {
		margin-top: 50rpx;
	}

	.productList .list .item .text .money .num {
		font-size: 34rpx;
	}

	.productList .list .item .text .vip {
		font-size: 22rpx;
		color: #aaa;
		margin-top: 7rpx;
	}

	.productList .list .item .text .vip.on {
		margin-top: 12rpx;
	}

	.productList .list .item .text .vip .vip-money {
		font-size: 24rpx;
		color: #282828;
		font-weight: bold;
	}

	.productList .list .item .text .vip .vip-money image {
		width: 46rpx;
		height: 21rpx;
		margin-left: 4rpx;
	}

	.pictrue {
		position: relative;
	}

	.fixed {
		z-index: 100;
		position: fixed;
		left: 0;
		top: 0;
		background-color: #fff;
		box-shadow: 0 10rpx 20rpx -5rpx rgba(0, 0, 0, 0.06);
		// background: linear-gradient(90deg, red 50%, #ff5400 100%);
	}

	.mores-txt {
		width: 100%;
		align-items: center;
		justify-content: center;
		height: 70rpx;
		color: #999;
		font-size: 24rpx;

		.iconfont {
			margin-top: 2rpx;
			font-size: 20rpx;
		}
	}

	.menu-txt {
		font-size: 24rpx;
		color: #454545;
	}

	.mp-bg {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 330rpx;
		// background: linear-gradient(90deg, #fff 50%, #fff 100%);
		// border-radius: 0 0 30rpx 30rpx;
	}

	.combination-item {
		width: 328rpx;
		height: 180rpx;
		display: inline-block;
		background-size: 100%;
		position: relative;
		background-size: cover;
		border-radius: 16rpx;

		.img-box {
			width: 122rpx;
			height: 122rpx;
			position: absolute;

			image,
			.easy-loadimage,
			uni-image {
				width: 122rpx;
				height: 122rpx;
			}
		}

		.name {
			font-size: 30rpx;
			color: #333333;
			font-weight: bold;
			line-height: 32rpx;
		}

		.price {
			display: block;
			font-size: 30rpx;
			font-weight: bold;
			margin-top: 8rpx;
			color: #e93323;

			text {
				font-size: 20rpx;
			}
		}

		.gocom_btn {
			display: block;
			margin-top: 6rpx;
			color: #fff;
			font-size: 22rpx;
			font-weight: bold;
			width: 100rpx;
			line-height: 30rpx;
			text-align: center;
			border-radius: 16rpx;

			text {
				font-weight: normal;
				font-size: 16rpx;
			}
		}

		&:nth-child(1) {
			height: 378rpx;
			padding: 20rpx 20rpx 28rpx;
			float: left;
			background-image: url();

			.img-box {
				width: 210rpx;
				height: 210rpx;
				right: 18rpx;
				bottom: 18rpx;

				image,
				.easy-loadimage,
				uni-image {
					width: 210rpx;
					height: 210rpx;
				}
			}

			.gocom_btn {
				background: linear-gradient(90deg, #fd5d48 0%, #f63724 100%);
			}
		}

		&:nth-child(2),
		&:nth-child(3) {
			float: right;
			padding: 20rpx 18rpx;

			.name {
				width: 148rpx;
			}

			.img-box {
				right: 14rpx;
				bottom: 14rpx;
			}
		}

		&:nth-child(2) {
			background-image: url();

			.gocom_btn {
				background: linear-gradient(90deg, #fdca1a 0%, #f7b21f 100%);
			}
		}

		&:nth-child(3) {
			margin-top: 18rpx;
			background-image: url();

			.img-box {
				right: 14rpx;
				bottom: 14rpx;
			}

			.gocom_btn {
				background: linear-gradient(90deg, #ffb052 0%, #fe961a 100%);
			}
		}
	}
</style>